<template>
  <el-descriptions title="结件登记表" direction="vertical" :column="3" border>
    <el-descriptions-item label="合同编号">{{
      props.msgData.contractNo
    }}</el-descriptions-item>
    <el-descriptions-item label="房屋位置" :span="2">{{
      props.msgData.location
    }}</el-descriptions-item>
    <el-descriptions-item label="费用合计"
      >{{ props.msgData.totalFee }}元</el-descriptions-item
    >
    <el-descriptions-item label="店面名称">{{
      props.msgData.storeName
    }}</el-descriptions-item>
    <el-descriptions-item label="登记人姓名">{{
      props.msgData.registrant
    }}</el-descriptions-item>
    <el-descriptions-item label="登记日期">{{
      props.msgData.registerDate
    }}</el-descriptions-item>
    <el-descriptions-item label="操作">
      <el-button @click="handleDetail" type="primary">查看明细</el-button>
    </el-descriptions-item>
  </el-descriptions>
  <el-dialog title="查看明细" v-model="newsOpen" width="1200px">
    <div>
      <el-table
        v-loading="loading"
        :data="props.msgData.saleDetails"
        border
        @selection-change="handleSelectionChange"
      >
        <el-table-column label="合同编号" align="center" prop="contractNo" />
        <el-table-column
          label="成交日期"
          align="center"
          prop="transactionDate"
        />
        <el-table-column
          label="房屋位置"
          align="center"
          prop="location"
          width="150"
        />
        <el-table-column label="买方" align="center" prop="buyer" />
        <el-table-column label="中介费" align="center" prop="buyerCommission" />
        <el-table-column label="卖方" align="center" prop="seller" />
        <el-table-column
          label="中介费"
          align="center"
          prop="sellerCommission"
        />
        <el-table-column
          label="店面交易费"
          align="center"
          prop="storeTransactionFee"
        />
        <el-table-column label="区域" align="center" prop="region" />
        <el-table-column label="店面" align="center" prop="storeName" />
        <el-table-column label="经纪人" align="center" prop="agent" />
        <el-table-column
          label="成交业绩"
          align="center"
          prop="transactionPerformance"
        />
        <el-table-column
          label="资源业绩"
          align="center"
          prop="resourcePerformance"
        />
        <el-table-column
          label="公司8%"
          align="center"
          prop="companyEightPercent"
        />
        <el-table-column
          label="公司交易费"
          align="center"
          prop="companyTransactionFee"
        />
        <el-table-column label="签约员" align="center" prop="signUserName" />
        <el-table-column
          label="交易类型"
          align="center"
          prop="contractCateName"
        />
        <el-table-column label="区长" align="center" prop="districtManager" />
        <el-table-column label="加盟商" align="center" prop="franchisee" />
        <el-table-column label="现店面" align="center" prop="currentStore" />
        <el-table-column label="交款日期" align="center" prop="paymentDate" />
        <el-table-column label="折扣率" align="center" prop="rate" />
        <el-table-column label="套数" align="center" prop="setNumber" />
        <el-table-column label="权证" align="center" prop="power" />
        <el-table-column
          label="交易费率"
          align="center"
          prop="transactionRate"
        />
      </el-table>
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="newsOpen = false">确 定</el-button>
        <el-button @click="newsOpen = false">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup name="newspaperDetails">
import { defineProps } from "vue";
const props = defineProps({
  msgData: {
    type: Object,
    default: () => {},
  },
});
const newsOpen = ref(false);
function handleDetail() {
  console.log(111);
  newsOpen.value = true;
}
</script>
